<template>
  <div class="front-main-content">
    <Card class="content-main agent-main">
      <!-- <p class="main-title" slot="title">运营商信息</p> -->
      <div class="btn-area">
        <RadioGroup size="small" v-model="currentApp" type="button">
          <Radio label="CustomChart">{{$t('D7F6SdVJDI6Fl_OpNhD3f')}}</Radio>
          <Radio label="CustomTable">{{$t('7OMfz4N7Dy3A0sK3wxtGi')}}</Radio>
          <Radio label="CustomMap">{{$t('NQTOBvGTmvdNDmq0wNBzt')}}</Radio>
        </RadioGroup>
      </div>
      <div class="main-wrap">
        <component :is="currentApp"></component>
      </div>
    </Card>
    <!-- <Card class="content-main station-main" v-else>
      <station-user-list></station-user-list>
    </Card> -->
  </div>
</template>

<script>
import CustomChart from './chart'
import CustomTable from './table'
import CustomMap from './map'
import { getAgentTableData, getStationList } from '@/api/data2'
import { createNamespacedHelpers } from 'vuex'
const {
  mapState,
  mapGetters,
  mapMutations,
  mapActions
} = createNamespacedHelpers('agent')
export default {
  name: 'front_overview',
  props: {
    id: String
  },
  components: {
    CustomChart,
    CustomTable,
    CustomMap
  },
  data () {
    return {
      currentApp: 'CustomChart'
    }
  },
  watch: {
    '$route' () {
      this.getStationList()
    }
  },
  async mounted () {
    await this.getAgentList()
    await this.getStationList()
  },
  computed: {
    isAdmin () {
      return this.$store.getters.isAdmin
    },
    isAgent () {
      return this.$store.getters.isAgent
    },
    isStation () {
      return this.$store.getters.isStation
    }
  },
  methods: {
    ...mapMutations(['setAllStations', 'setAllAgents']),
    async getAgentList () {
      const { code, data, desc } = await getAgentTableData()
      if (code == 200) {
        const datalist = data.datalist || []
        this.setAllAgents(_.cloneDeep(datalist))
      } else {
        this.$Message.error(desc)
      }
    },
    async getStationList () {
      const { code, data, desc } = await getStationList({
        operatorid: +this.id
      })
      if (code == 200) {
        const datalist = data.datalist || []
        this.setAllStations(_.cloneDeep(datalist))
      } else {
        this.$Message.error(desc)
      }
    }
  }
}
</script>
